<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
    <!-- 微软的老式浏览器 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <link rel="stylesheet" href="css/weui.min.css">
    <link rel="stylesheet" href="css/jq-weui.min.css">
    <link rel="stylesheet" href="css/layui.mobile.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">
	<script src="js/jquery/rem.min.js"></script>
	<script src="js/common.js"></script>
	<title>发布活动</title>
	<style>
		.img-list{
			padding: 15px 10px 10px;
		}
		.img-list a{
			width: 20px;
			height: 20px;
			background: url(cssimg/gb.png) no-repeat center;
			background-size: 20px;
			z-index: 99;
			right: -5px;
			top: -5px;
		}
		.spinner{width:20px;height:20px;position:fixed;z-index:1002;top:50%;margin-top:-10px;left:50%;margin-left:-10px}.container1>div,.container2>div,.container3>div{width:6px;height:6px;background-color:#ff536a;border-radius:100%;position:absolute;-webkit-animation:bouncedelay 1.2s infinite ease-in-out;animation:bouncedelay 1.2s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}.spinner .spinner-container{position:absolute;width:100%;height:100%}.container2{-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg)}.container3{-webkit-transform:rotateZ(90deg);transform:rotateZ(90deg)}.circle1{top:0;left:0}.circle2{top:0;right:0}.circle3{right:0;bottom:0}.circle4{left:0;bottom:0}.container2 .circle1{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.container3 .circle1{-webkit-animation-delay:-1.0s;animation-delay:-1.0s}.container1 .circle2{-webkit-animation-delay:-0.9s;animation-delay:-0.9s}.container2 .circle2{-webkit-animation-delay:-0.8s;animation-delay:-0.8s}.container3 .circle2{-webkit-animation-delay:-0.7s;animation-delay:-0.7s}.container1 .circle3{-webkit-animation-delay:-0.6s;animation-delay:-0.6s}.container2 .circle3{-webkit-animation-delay:-0.5s;animation-delay:-0.5s}.container3 .circle3{-webkit-animation-delay:-0.4s;animation-delay:-0.4s}.container1 .circle4{-webkit-animation-delay:-0.3s;animation-delay:-0.3s}.container2 .circle4{-webkit-animation-delay:-0.2s;animation-delay:-0.2s}.container3 .circle4{-webkit-animation-delay:-0.1s;animation-delay:-0.1s}@-webkit-keyframes bouncedelay{0%,80%,100%{-webkit-transform:scale(0.0)}40%{-webkit-transform:scale(1.0)}}@keyframes bouncedelay{0%,80%,100%{transform:scale(0.0);-webkit-transform:scale(0.0)}40%{transform:scale(1.0);-webkit-transform:scale(1.0)}}#loading .mask{position:fixed;width:100%;background-color:#fff;top:0;left:0;height:100%;z-index:1001}
	</style>
</head>
<body>
<div id="loading">
	<div class="mask"></div>
	<div class="spinner">
		<div class="spinner-container container1">
			<div class="circle1"></div>
			<div class="circle2"></div>
			<div class="circle3"></div>
			<div class="circle4"></div>
		</div>
		<div class="spinner-container container2">
			<div class="circle1"></div>
			<div class="circle2"></div>
			<div class="circle3"></div>
			<div class="circle4"></div>
		</div>
		<div class="spinner-container container3">
			<div class="circle1"></div>
			<div class="circle2"></div>
			<div class="circle3"></div>
			<div class="circle4"></div>
		</div>
	</div>
</div>
	<div class="activities">
		<input name="textfield" type="text"  id="hdname" maxlength="20" placeholder="活动名称"/>
	</div>
	<div class="content">
		<textarea cols="50" rows="5" id="textarea" placeholder="活动内容"></textarea>
	</div>
<div class="Statistics">
	<input value="开始时间"  readonly  unselectable="on" onfocus="this.blur()">
	<input  id="date" value="" readonly  unselectable="on" onfocus="this.blur()" style="padding: 0 10px;font-size: 12px;" />
</div>
	<div class="Statistics">
    	<input  type="text" id="addres" maxlength="20" placeholder="地址"  />
    	<input   id="num"   value="人数" readonly="readonly"  unselectable="on"  onfocus="this.blur()">
	</div>
	<div class="Estimate">
		<input name="" type="tel" id="yjfy" maxlength="20" placeholder="预计费用"/>
	</div>
	<div class="payment">
		<input  type="text" id="pay"   value="请选择付款方式" readonly="readonly"  unselectable="on" onfocus="this.blur()">
	</div>
	<div class="type" id="list">
		<p>活动类型</p>
	</div>
	<input hidden value="" id="hdlx">
	<div class="pptv">
         <div class="popo">
			 <div class="img-list">
				 <div id="imglist">
					 <!--<div class="img pr" style="background-image: url(http://cpfile.oss-cn-beijing.aliyuncs.com/portrait_pic/liuyifei1.jpg)">-->
						 <!--<a href="javascript:;" class="pa" onclick="del(this)"></a>-->
					 <!--</div>-->
				 </div>
				 <div class="addhao" id="upload-btn">
				 </div>
			 </div>

			 <input style="display: none" type="file" id="file" accept="image/png,image/gif,image/jpeg,image/jpg">
      	</div>
    </div>

	<div class="dibu">
		<input type="button" name="" id="fbbtn" value="发布" onclick="submit()">
	</div>
	<script src="js/jquery/jquery-2.2.4.min.js"></script>
	<script src="js/jquery/jquery-weui.min.js"></script>
	<script src="js/jquery/weui.min.js"></script>
	<script src="js/jquery/layer.js"></script>
	<script src="js/jquery/upload.js"></script>
	<script type="text/javascript">
        var imgarr=[];
        getActivity();
        var timev3="";
        var datav=(new Date().getMonth()+1)<10 ?"0"+(new Date().getMonth()+1):(new Date().getMonth()+1);
		var timev=new Date().getFullYear()+"-"+datav+"-"+new Date().getDate();
		var timev2=(new Date().getFullYear()+10)+"-"+datav+"-"+new Date().getDate();
		$("#date").val(new Date().getFullYear()+"年"+datav+"月"+new Date().getDate()+"日 "+new Date().getHours()+"时"+new Date().getMinutes()+"分")
        $("#date").datetimePicker({
            min:timev,
            max: timev2,
            title: '选择活动开始时间',
            yearSplit: '年',
            monthSplit: '月',
            dateSplit: '日',
            times: function () {
                return [
                    {
                        values: (function () {
                            var hours = [];
                            for (var i=0; i<24; i++) hours.push(i > 9 ? i : '0'+i);
                            return hours;
                        })()
                    },
                    {
                        divider: true,  // 这是一个分隔符
                        content: '时'
                    },
                    {
                        values: (function () {
                            var minutes = [];
                            for (var i=0; i<59; i++) minutes.push(i > 9 ? i : '0'+i);
                            return minutes;
                        })()
                    },
                    {
                        divider: true,  // 这是一个分隔符
                        content: '分'
                    }
                ];
            },

            onChange: function (picker, values, displayValues) {
                console.log(values);
                timev3=values[0]+"/"+values[1]+"/"+values[2]+" "+values[3]+":"+values[4]+":"+"00";
				console.log(timev3)
            }
        });

        $(function () {
            //$('#date').on('click', function () {
//                weui.datePicker({
//                    start: new Date().getFullYear(),
//                    end: new Date().getFullYear(),
//                    onChange: function (result) {
//                        console.log(result);
//                    },
//                    onConfirm: function (result) {
//                        console.log(result);
//                        $('#date').val(result.join("/"))
//                    }
//                });

          //  });

            $('#pay').on('click', function () {
                weui.picker([{
                    label: 'AA制',
                    value: 1
                }, {
                    label: '我请客',
                    value: 2
                }, {
                    label: '男士请客',
                    value: 3
                }], {
                    onConfirm: function (result) {
                        console.log(result);
                        var str="";
                        if(result==1){
                            str="AA制"
                        }else if(result==2){
                            str="我请客"
                        }else if(result==3){
                            str="男士请客"
                        }
                        $("#pay").val(str).attr("data-id",result)
                    }
                });
            });

            $('#num').on('click', function () {
                weui.picker([{
                    label: '1',
                    value: 1
                }, {
                    label: '2',
                    value: 2
                }, {
                    label: '3',
                    value: 3
                }, {
                    label: '4',
                    value: 4
                }, {
                    label: '5',
                    value: 5
                }, {
                    label: '6',
                    value: 6
                }, {
                    label: '7',
                    value: 7
                }, {
                    label: '8',
                    value: 8
                }, {
                    label: '9',
                    value: 9
                }, {
                    label: '10',
                    value: 10
                }, {
                    label: '多人',
                    value: 100
                }], {
                    onConfirm: function (result) {
                        console.log(result);
                        var str="";
                        if(result==1){
                            str="1"
                        }else if(result==2){
                            str="2"
                        }else if(result==3){
                            str="3"
                        }else if(result==4){
                            str="4"
                        }else if(result==5){
                            str="5"
                        }else if(result==6){
                            str="6"
                        }else if(result==7){
                            str="7"
                        }else if(result==8){
                            str="8"
                        }else if(result==9){
                            str="9"
                        }else if(result==10){
                            str="10"
                        }else if(result==100){
                            str="多人"
                        }
                        $("#num").val(str).attr("data-id",result)
                    }
                });
            });


            new Upload({
                button :"#upload-btn",
                file : '#file',
                module : 'album',
                success : function (url) {
                    $("#imglist").html("");
                    imgarr.push(url);
                    console.log(imgarr)
                    var strs="";
                    $.each(imgarr,function (i,el) {
                        strs+=`<div class="img pr" style="background-image: url(`+el+`)">
						 <a href="javascript:;" class="pa" data-id=`+i+` onclick="del(this)"></a>
					 </div>`
                    });
                    $(strs).appendTo("#imglist")
                },
                error : function (data) {
                    alert('error');
                }
            });


        });
        function del(obj) {
            var $this=$(obj);
            var index=$this.attr("data-id");
            imgarr.splice(index,1);
            $this.parent().remove();
            $("#imglist").html("");
            var strs="";
            $.each(imgarr,function (i,el) {
                strs+=`<div class="img pr" style="background-image: url(`+el+`)">
						 <a href="javascript:;" class="pa" data-id=`+i+` onclick="del(this)"></a>
					 </div>`
            });
            $(strs).appendTo("#imglist")
            console.log(imgarr)
        }
		function submit() {
		    var time=0;
		    time=Date.parse(new Date(timev3))/1000;
		    var nowtime=Math.floor(new Date().getTime()/1000);
            console.log(time +"//////"+nowtime);
			if($("#hdname").val()==""){
				layer.open({
					content:"活动名称不能为空",
					time:1,
                    skin:"msg",
				});
				return  false
			}else if($("#textarea").val()==""){
                layer.open({
                    content:"活动内容不能为空",
                    time:1,
                    skin:"msg",
                });
                return  false
			}else if($("#date").val()=="选择时间"){
                layer.open({
                    content:"请选择活动时间",
                    time:1,
                    skin:"msg",
                });
                return  false
            }else if(time<=nowtime){
                layer.open({
                    content:"活动时间选择有误",
                    time:1,
                    skin:"msg",
                });
                return  false
            }else if($("#addres").val()==""){
                layer.open({
                    content:"填写活动地点",
                    time:1,
                    skin:"msg",
                });
                return  false
            }else if($("#num").val()==""){
                layer.open({
                    content:"请填写活动人数",
                    time:1,
                    skin:"msg",
                });
                return  false
            }else if($("#yjfy").val()==""){
                layer.open({
                    content:"请填写预计费用",
                    time:1,
                    skin:"msg",
                });
                return  false
            }else if($("#pay").val()=="请选择付款方式"){
                layer.open({
                    content:"请填写付款方式",
                    time:1,
                    skin:"msg",
                });
                return  false
            }else if($("#date").val()==""){
                layer.open({
                    content:"请选择活动时间",
                    time:1,
                    skin:"msg",
                });
                return  false
            }else if($("#hdlx").val()==""){
                layer.open({
                    content:"请选择活动类型",
                    time:1

                });
                return  false
            }
//            else if($("#img").find('img')[0].currentSrc==undefined){
//                layer.open({
//                    content:"请选择图片",
//                    time:1
//                });
//                return  false
//			}
			else {
				layer.open({
					content:"数据提交中....",
					skin:"msg",
					time:100
				});
                var param={
                    user_id:"1",
                    activity_type_id:$("#hdlx").val(),
                    name:$("#hdname").val(),
                    content:$("#textarea").val(),
                    start_time:time,
                    place:$("#addres").val(),
                    person_cnt:$("#num").attr("data-id"),
                    cost:$("#yjfy").val(),
                    cost_desc:$("#pay").val(),
                    logo_url:imgarr.toString()
				};
				console.log(param);
                    $.ajax({
                        type : "POST",
                        url : getRequestUrl("/user/add_activity"),
                        data:param,
                        success : function(datas) {
                            console.log(datas);
                            if(datas.response_params.result===0){
                                layer.open({
                                    content:"活动发布成功!",
                                    time:10
                                });
                                setTimeout(function () {
                                    history.back(-1)
                                },1000)
							}else {
                                layer.open({
                                    content:"活动发布失败!稍后重试",
                                    time:1
                                });
							}
                        },
                        error : function(err) {
                            if(err.responseJSON.error_code==31003){
                                //$("#loading").hide();
                                layer.open({
                                    content: "您还未完成实名认证，完成实名认证即可享受更多免费福利哦~"
                                    ,btn: ['认证去', '再看看']
                                    ,yes: function(index){
                                        // window.location.href="Edit-information.html";
                                        // layer.close(index);
                                        layer.open({
                                            content: "为保证安全实名认证为手机号+身份证认证+填写个人详细信息。"
                                            ,btn: ['认证去', '填信息']
                                            ,no: function(index){
                                                window.location.href="Edit-information.html";
                                                layer.close(index);
                                            }
                                            ,yes: function(index){
                                                window.location.href="certification.html";
                                                layer.close(index);
                                            }
                                        });
                                    }
                                });
                                return false
                            }
                        	//dealCPErrorResponse(err);
                        }
                    });
			}


        }
        function getActivity() {
            $.ajax({
                type : "GET",
                url : getRequestUrl("/activity/get_type"),
                dataType : 'json',
                async: true,
                //contentType : "application/json",
                success : function(datas) {
                    console.log(datas);
                    if(datas.response_params.result!=0){
                        var arr=datas.response_params.result;
                        var strs="";
                        $.each(arr,function (i,e) {
                            strs+=`<input type="button"  data-id=`+arr[i].activity_id+`   value=`+arr[i].activity_name+` onclick="addClass(this)">`
                        });
                        $(strs).appendTo("#list");
                        $("#loading").hide();
					}

                },
                error : function(err) {
                	dealCPErrorResponse(err);
                }
            });
        }

        function addClass(obj) {
			var $this=$(obj);
			var id=$this.attr("data-id");
            $this.addClass("active").siblings().removeClass("active");
            $("#hdlx").val(id);
        }
	</script>
<script type="text/javascript">


</script>

</body>
</html>